<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
    <meta charset="utf-8" />
    <title>科级管理人员个人有关事项报告管理系统</title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
    <meta content="" name="description" />
    <meta content="" name="author" />
    <!-- BEGIN GLOBAL MANDATORY STYLES -->
    <link href="media/css/jquery.gritter.css" rel="stylesheet" type="text/css"/>

    <link href="media/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/style-metro.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/style-responsive.css" rel="stylesheet" type="text/css"/>
    <link href="media/css/default.css" rel="stylesheet" type="text/css" id="style_color"/>
    <link href="media/css/uniform.default.css" rel="stylesheet" type="text/css"/>
    <!-- END GLOBAL MANDATORY STYLES -->
    <!-- BEGIN PAGE LEVEL STYLES -->
    <link rel="stylesheet" type="text/css" href="media/css/select2_metro.css" />
    <link rel="stylesheet" href="media/css/DT_bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="media/css/datepicker.css" />
    <!-- END PAGE LEVEL STYLES -->
    <link rel="shortcut icon" href="media/image/favicon.ico" />

</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body class="page-header-fixed page-sidebar-closed">
<!-- BEGIN HEADER -->
<jsp:include page="../fragment/header.jsp"/>
<!-- END HEADER -->
<!-- BEGIN CONTAINER -->
<div class="page-container" >
    <jsp:include page="../fragment/sidebar.jsp"/>
    <!-- END SIDEBAR -->
    <!-- BEGIN PAGE -->
    <div class="page-content" style="background-color:#f5f5f5;">
        <!-- BEGIN PAGE CONTAINER-->
        <!-- BEGIN PAGE HEADER-->
        <div class="container-fluid" style="margin-left: -20px;">
            <div class="row-fluid" style="margin-bottom: 5px;">
                <jsp:include page="../fragment/navigation.jsp"></jsp:include>
            </div>
        <div class="row-fluid">
            <div class="span12">
                <div class="span3">
                    <div class="portlet box green" style="margin-left: 10px;">
                        <div class="portlet-title">
                            <div class="caption"><i class="icon-reorder"></i>填报说明</div>
                        </div>
                        <div class="portlet-body">
                            <div class="scroller" data-height="300px">
                                <p style="color:#6983ff;font-weight: bold">
                                    该项目填写子女与外国人、无国籍人通婚以及与港澳以及台湾居民通婚的情况，无此类情况不填写。
                                </p>
                            </div>
                        </div>
                    </div>
                    <form>
                        <div class="form-actions">
                            <a href="chuguo" class="btn blue">填报上一项</a>
                            <a href="zinvyiju" class="btn blue">填报下一项</a>
                        </div>
                    </form>
                </div>
                <div class="span9">
                    <form action="#" class="horizontal-form" >
                        <div class="portlet box green">
                            <div class="portlet-title">
                                <div class="caption"><i class="icon-globe"></i> 子女与外国人、无国籍人、港澳及台湾居民通婚情况</div>
                                <div class="actions">
                                    <a href="#zinvhunyinmodal" role="button" class="btn blue" data-toggle="modal"><i class="icon-edit"></i> 新增</a>
                                </div>
                            </div>
                            <div class="portlet-body">
                                <div id="zinvhunyin_div_id">
                                    <table class="table table-striped table-bordered table-hover" id="zinvhunyin-table">
                                        <thead>
                                        <tr>
                                            <%--<th>是否变化</th>--%>
                                            <th>称谓</th>
                                            <th class="hidden-480">子女姓名</th>
                                            <th class="hidden-480">子女配偶姓名</th>
                                            <th class="hidden-480">国籍(地区)</th>
                                            <th class="hidden-480">工作(学习)单位</th>
                                            <th class="hidden-480">职务</th>
                                            <th class="hidden-480">婚姻登记时间</th>
                                            <th class="hidden-480">操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <c:forEach items="${list}" var="zinvhunyin">
                                            <tr class="odd gradeX">
                                                <%--<td>${zinvhunyin.RPTCHANGE}</td>--%>
                                                <td>${zinvhunyin.RELATION}</td>
                                                <td>${zinvhunyin.NAME}</td>
                                                <td>${zinvhunyin.SPOUSENAME}</td>
                                                <td>${zinvhunyin.SPOUSECOUNTRY}</td>
                                                <td>${zinvhunyin.SPOUSEUNIT}</td>
                                                <td>${zinvhunyin.SPOUSEDUTY}</td>
                                                <td>${zinvhunyin.REGISTRATIONDATE}</td>
                                                <td>
                                                    <a href="javascript:void(0);" onclick="delBtn('${zinvhunyin.SID}')" class="btn red icn-only">删除</a> <a href="javascript:void(0);" onclick="updInfoBtn('${zinvhunyin.SID}')" class="btn blue icn-only">修改</a>
                                                </td>
                                            </tr>
                                        </c:forEach>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                    </form>
                </div>
            </div>
        </div>
        <!-- END PAGE CONTAINER-->
        </div></div>
    </div>
    <!-- END PAGE -->
</div>
<!-- END CONTAINER -->

<div id="zinvhunyinmodal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel3" aria-hidden="true" data-backdrop="static">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h5 id="myModalLabel3">子女与外国人、无国籍人、港澳及台湾居民通婚情况</h5>
    </div>
    <div class="modal-body">
        <div style="color: transparent">
            <form action="#"  id="zinvhunyin-form">
                <div class="row-fluid">
                    <div class="span12">
                        <%--<div class="span3 ">--%>
                            <%--<div class="control-group">--%>
                                <%--<label class="control-label" style="color: #0e0e0e;">是否变化</label>--%>
                                <%--<div class="controls">--%>
                                    <%--<select class="span12 select2_category" name="RPTCHANGE" id="RPTCHANGE" data-placeholder="Choose a Category" tabindex="1">--%>
                                        <%--<option value=""></option>--%>
                                        <%--<option value="是">是</option>--%>
                                        <%--<option value="否">否</option>--%>
                                    <%--</select>--%>
                                <%--</div>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                        <!--/span-->
                        <div class="span4 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">称谓</label>
                                <div class="controls">
                                    <select class="span12 select2_category" name="RELATION" id="RELATION" data-placeholder="Choose a Category" tabindex="1">
                                        <option value=""></option>
                                        <option value="儿子" >儿子</option>
                                        <option value="女儿" >女儿</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <!--/span-->
                        <div class="span4 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">子女姓名</label>
                                <div class="controls">
                                    <input class="span12 m-wrap" name="NAME" id="NAME" type="text"  value=""/>
                                </div>
                            </div>
                        </div>
                        <div class="span4 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">登记时间</label>
                                <div class="controls">
                                  <input class="span12 m-wrap m-ctrl-medium date-picker" name="REGISTRATIONDATE"  data-format="MM/dd/yyyy" id="REGISTRATIONDATE" readonly size="16" type="text" value="" />
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
                <div class="row-fluid">
                    <div class="span12">
                        <div class="span3 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">子女配偶姓名</label>
                                <div class="controls">
                                    <input class="span12 m-wrap" name="SPOUSENAME" id="SPOUSENAME" type="text" value="" />
                                    <input class="hidden" name="FLAG" id="FLAG" value="ZINVHUNYIN">
                                </div>
                            </div>
                        </div>
                        <div class="span3 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">国籍（地区）</label>
                                <div class="controls">
                                    <input class="span12 m-wrap" name="SPOUSECOUNTRY" id="SPOUSECOUNTRY" type="text" value=""/>
                                </div>
                            </div>
                        </div>
                        <div class="span3 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">工作(学习)单位</label>
                                <div class="controls">
                                    <input class="span12 m-wrap" name="SPOUSEUNIT" id="SPOUSEUNIT" type="text" value=""/>
                                </div>
                            </div>
                        </div>
                        <div class="span3 ">
                            <div class="control-group">
                                <label class="control-label" style="color: #0e0e0e;">职务</label>
                                <div class="controls">
                                    <input class="span12 m-wrap" name="SPOUSEDUTY" id="SPOUSEDUTY" type="text" value="" />
                                    <input class="hidden" name="SID" id="SID">
                                </div>
                            </div>
                        </div>

                        <%--<div class="span3 ">--%>
                            <%--<div class="control-group">--%>
                                <%--<label class="control-label" style="color: #0e0e0e;">登记时间</label>--%>
                                <%--<div class="controls">--%>
                                    <%--<input class="span12 m-wrap m-ctrl-medium date-picker" name="REGISTRATIONDATE"  data-format="MM/dd/yyyy" id="REGISTRATIONDATE" readonly size="16" type="text" value="" />--%>
                                <%--</div>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="modal-footer">
        <%--<button class="btn" data-dismiss="modal" aria-hidden="true">取消</button>--%>
        <button data-dismiss="modal" class="btn blue" id="zinvhunyinSaveBtn">保存</button>
    </div>
</div>


<!-- BEGIN PAGE LEVEL PLUGINS -->
<script type="text/javascript" src="media/js/jquery.gritter.js"></script>
<script type="text/javascript" src="media/js/jquery.pulsate.min.js"></script>
<script type="text/javascript" src="media/js/jquery.bootpag.min.js"></script>
<!-- END PAGE LEVEL PLUGINS -->
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="media/js/ui-general.js"></script>
<!-- END PAGE LEVEL SCRIPTS -->
<script src="media/js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script src="media/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
<script src="media/js/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script>
<script src="media/js/bootstrap.min.js" type="text/javascript"></script>
<!--[if lt IE 9]>
<script src="media/js/excanvas.min.js"></script>
<script src="media/js/respond.min.js"></script>
<![endif]-->
<script src="media/js/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="media/js/jquery.blockui.min.js" type="text/javascript"></script>
<script src="media/js/jquery.cookie.min.js" type="text/javascript"></script>
<script src="media/js/jquery.uniform.min.js" type="text/javascript" ></script>
<!-- END CORE PLUGINS -->
<!-- BEGIN PAGE LEVEL PLUGINS -->
<script type="text/javascript" src="media/js/select2.min.js"></script>
<script type="text/javascript" src="media/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="media/js/DT_bootstrap.js"></script>
<script type="text/javascript" src="media/js/bootstrap-datepicker.js"></script>
<!-- END PAGE LEVEL PLUGINS -->
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="media/js/app.js"></script>
<script src="media/js/table-editable.js"></script>


<script>
    //begin 个人收入所得
    $('#zinvhunyin-table').dataTable({
        "aoColumns": [
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false }
        ],
        "aLengthMenu": [
            [5, 15, 20, 99999],
            [5, 15, 20, "所有"] // change per page values here
        ],
        "iDisplayLength": 5,
        "bFilter" : false,
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
        "sPaginationType": "bootstrap",
        "oLanguage": {
            "sLengthMenu": "_MENU_ (记录/页)",
            "sInfo" : "从 _START_ 到  _END_ 条记录 总记录数为 _TOTAL_ 条",
            "oPaginate": {
                "sPrevious": "上一页",
                "sNext": "下一页"
            }
        }
    });
    //end  个人收入所得
</script>

<script>
    $('#zinvhunyinSaveBtn').on('click',function(){
        $.ajax({
            type : 'POST',
            url : 'save',
            data : $('#zinvhunyin-form').serialize(),
            async : false,
            success : function(data){
                $('#SPOUSECOUNTRY').val('');
                $('#SPOUSENAME').val('');
                $('#NAME').val('');
                $('#SID').val('');
                $('#SPOUSEUNIT').val('');
                $('#SPOUSEDUTY').val('');
                $('#REGISTRATIONDATE').val('');
                $("#RPTCHANGE option[value='']").attr("selected", true);
                $("#RELATION option[value='']").attr("selected", true);
                $('#zinvhunyin_div_id').html(data);
            }
        });
    })
</script>

<script>
    function delBtn(ID){
        $.ajax({
            type : 'POST',
            url : 'delete',
            data : {'SID':ID,'FLAG':'ZINVHUNYIN'},
            async : true,
            success : function(data){
                $("#zinvhunyin_div_id").html(data);
            }
        });
    }
</script>
<script>
    function updInfoBtn(ID){
        $.ajax({
            type : 'post',
            url : 'updInfo',
            data : {'SID':ID,'FLAG':'ZINVHUNYIN'},
            async : true,
            success : function(data){
                $('#SPOUSECOUNTRY').val(data.ByID.SPOUSECOUNTRY);
                $('#SPOUSENAME').val(data.ByID.SPOUSENAME);
                $('#NAME').val(data.ByID.NAME);
                $('#SID').val(data.ByID.SID);
                $('#SPOUSEUNIT').val(data.ByID.SPOUSEUNIT);
                $('#SPOUSEDUTY').val(data.ByID.SPOUSEDUTY);
                $('#REGISTRATIONDATE').val(data.ByID.REGISTRATIONDATE);
                $("#RPTCHANGE option[value='"+data.ByID.RPTCHANGE+"']").attr("selected", true);
                $("#RELATION option[value='"+data.ByID.RELATION+"']").attr("selected", true);
                $('#zinvhunyinmodal').modal('show');
            }
        })
    }
</script>

<script>
    jQuery(document).ready(function() {
        $('#zinvhunyin').addClass('green');
        $('.date-picker').datepicker({
            rtl : App.isRTL()
        });
        App.init();
        UIGeneral.init();
        TableEditable.init();
    });
</script>
<!-- END JAVASCRIPTS -->
<script type="text/javascript">  var _gaq = _gaq || [];  _gaq.push(['_setAccount', 'UA-37564768-1']);  _gaq.push(['_setDomainName', 'keenthemes.com']);  _gaq.push(['_setAllowLinker', true]);  _gaq.push(['_trackPageview']);  (function() {    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;    ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'stats.g.doubleclick.net/dc.js';    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);  })();</script></body>
<!-- END BODY -->
</html>